<template>
    <div class="banner">   
        <van-swipe class="my-swipe" :autoplay="3000" indicator-color="white">
  <van-swipe-item v-for="item in arr" :key="item.id" ><img :src="$pre+item.img" alt=""></van-swipe-item>

</van-swipe>                      
                                          <!-- http://localhost:3000 -->
        <!-- <img v-for="item in arr" :key="item.id" :src="$pre+item.img" alt=""> -->
    </div>
</template>
<script>
import { Swipe, SwipeItem } from 'vant';
import { getHomebanner } from "../../../http/http"
export default {
    data() {
        return {
            arr:[]
        }
    },
    mounted() {
      getHomebanner().then(res=>{
            // console.log(res);
            this.arr=res.data.list
        })
    },
}
</script>
<style scoped>
.banner img{
  width: 100%;
  height: 100%;

}
  .my-swipe .van-swipe-item {
    color: #fff;
    font-size: 20px;
    height: 3.5rem;
    text-align: center;
    /* background-color: #39a9ed; */
  }


</style>